{literal}
<script>
	function dateCompare(time2) {
		var t1 = new Date();
		var t2 = new Date();
		parts = time2.split(":");
		t2.setHours(parts[0], parts[1], 0, 0);

		// returns 1 if greater, -1 if less and 0 if the same
		if (t1.getTime() > t2.getTime())
			return -1;
		if (t1.getTime() < t2.getTime())
			return 1;
		return 0;
	}

	function setUsr(id) {

		$("#successAlert").hide("slow");
		quickSearch("");
		$("input#search").val("");
		$("#usrDiv").show("slow");
		$.ajax({
			type : "POST",
			url : "usuarios.php?operacion=getById",
			data : 'idUsr=' + id,
			cache : false,
			success : function(result) {
// 				alert(result);
				var usr = jQuery.parseJSON(result);
				$("#nombreSp").html(usr.nombre + " " + usr.apellido);
				if(usr.libre=='S'){
					$("#creditosSp").html("Libre");
				}else{
					$("#creditosSp").html(usr.creditos);
				}			
				$("#vencimientoSp").html(usr.vencimientoCreditosStr);
				$("#idUsrHdn").val(usr.id);
				
			}
		});
		
	}

	function quickSearch(searchString) {

		var search_string = searchString; 
		// Do Search
		if (search_string !== '' && search_string.length >1) {
			$.ajax({
				type : "POST",
				url : "usuarios.php?operacion=quickSearch",
				data : 'searchFilter=' + search_string,
				cache : false,
				success : function(html) {
					$("ul#results").html(html);
				}
			});
			$("ul#results").fadeIn();
			$('h4#results-text').fadeIn();
		}else{
			$("ul#results").fadeOut();
			$('h4#results-text').fadeOut();
			}
		return false;

	}

	$(document).ready(function() {
		$("input#search").on("keyup", function(e) {

			// Set Search String
			quickSearch($(this).val());		

		});
	});

	$(document)
	.ready(
			function() {
				$("#inscribirBtn").click(function() {

									var idUsr = $("#idUsrHdn").val();
									var idHorario = $("#idHorarioHdn").val();
									var idClase = $("#idClaseHdn").val();
									var buttonId = $("#buttonIdHdn").val();

									var dataString = 'idUsr=' + idUsr
											+ '&idHorario=' + idHorario
											+ '&idClase=' + idClase;
									$
											.ajax({
												type : "POST",
												url : "grilla.php?operacion=reservaTurno",
												data : dataString,
												cache : false,
												success : function(
														result) {
													// 											$('#'+buttonId).css('background-color', '#777');
													// 											$('#'+buttonId).css('border-color', '#777');
													var resultado = jQuery
															.parseJSON(result);
													if (resultado.errorMsg) {
														$('#errorMsg')
																.html(
																		resultado.errorMsg);
														$('#errorMsg')
																.show(
																		"slow");
													} else {
														var usuarioR = resultado[1];
														var claseR = resultado[0];
														setTimeout(function(){
														cargarInscriptos(claseR.id);
														}, 2000);
														$("#usrDiv").hide();
														$("#usrAlertSp").html(usuarioR.nombre + " " +usuarioR.apellido);
														$("#successAlert").show("slow");
																												
													}

												}
											});
									return false;
								});
			});
	
	$(document)
			.ready(
					function() {
						$("#reservaConfirmaBtn")
								.click(
										function() {

											var idUsr = $("#idUsrHdn").val();
											var idHorario = $("#idHorarioHdn")
													.val();
											var idClase = $("#idClaseHdn")
													.val();
											var buttonId = $("#buttonIdHdn")
													.val();

											var dataString = 'idUsr=' + idUsr
													+ '&idHorario=' + idHorario
													+ '&idClase=' + idClase;
											$
													.ajax({
														type : "POST",
														url : "grilla.php?operacion=reservaTurno",
														data : dataString,
														cache : false,
														success : function(
																result) {
															// 											$('#'+buttonId).css('background-color', '#777');
															// 											$('#'+buttonId).css('border-color', '#777');
															var resultado = jQuery
																	.parseJSON(result);
															if (resultado.errorMsg) {
																$('#errorMsg')
																		.html(
																				resultado.errorMsg);
																$('#errorMsg')
																		.show(
																				"slow");
															} else {
																var usuarioR = resultado[1];
																var credit = "";
																if (usuarioR.libre == 'S') {
																	credit = "Libre";
																} else {
																	credit = usuarioR.creditos;
																}
																$('#creditosSp')
																		.html(
																				credit);
																$(
																		'#'
																				+ buttonId)
																		.css(
																				'background-color',
																				'#777');
																$(
																		'#'
																				+ buttonId)
																		.css(
																				'border-color',
																				'#777');
																$('#cargaUsr')
																		.modal(
																				'toggle');
															}

														}
													});
											return false;
										});
					});

	$(document).ready(function() {
		crearYCargarGrilla(0);
	});

// 	$(document).ready(function() {
// 		$('input.presente').click(function() {
// 			alert();
// 			// store the values from the form checkbox box, then send via ajax below
// 			var check_active = $(this).is(':checked') ? 1 : 0;
// 			var check_id = $(this).attr('value');
// 			// 		    $.ajax({
// 			// 		        type: "POST",
// 			// 		        url: "http://nowfoods.marketspacecom.com/nextstep/ajax.php",
// 			// 		        data: {id: check_id, active: check_active}
// 			// 		        success: function(){
// 			// 		            $('form#submit').hide(function(){$('div.success').fadeIn();});

// 			// 		        }
// 			// 		    });
// 			return true;
// 		});
// 	});
	
	$(document).on('click', "input.presente", function() {
	    
	    var idClase = $(this).attr('idClase');        
	    var idUsr = $(this).attr('idUsr');
	    var check_active = $(this).is(':checked') ? 'S' : 'N';
		    $.ajax({
					        type: "POST",
					        url: "grilla.php?operacion=registrarPresente",
					        data: {idClase: idClase, presente: check_active,idUsr:idUsr},
					        success: function(){
// 					            $('form#submit').hide(function(){$('div.success').fadeIn();});

					        }
					    });
	    
	});
    var semanaVar = 0;
	function crearYCargarGrilla(semana){
		
		$("#contenedor").empty();
		$("#tbl_schedule").empty();
		$.ajax({
			type : "POST",
			url : "grilla.php?operacion=getWeekAdmin&week="+semana,
			cache : false,
			success : function(result) {

				resultJson = jQuery.parseJSON(result);
				arrDates = resultJson[0];
				arrData = resultJson[1];
				generateSchedule(arrDates);
				loadSchedule(arrData);
			}
		});
	}
	
	function retrocederSemana(){
		semanaVar = semanaVar-1;
		crearYCargarGrilla(semanaVar);
	}
	function avanzarSemana(){
		semanaVar = semanaVar+1;
		crearYCargarGrilla(semanaVar);
	}
	
	function generateSchedule(arrDates) {
		var tbl = document.createElement('table');
		tbl.id = 'tbl_schedule';
		tbl.style.width = '100%';
		tbl.border = 1;
		tbl.className = 'table table-striped';
		tbl.cellSpacing = 0;
		tbl.cellPadding = 0;
		document.getElementById('contenedor').appendChild(tbl);

		// - Titulos
		var rowTitle = tbl.insertRow(-1);
		for (var i = 0; i < arrDates.length; i++) {
			var cellTitle = rowTitle.insertCell(-1);
			var dia = arrDates[i];
			
			
			var cellHtml = "<strong>" + dia.nombre + "</strong><br/><h5>"
					+ dia.nro + " de " + dia.mes + "</h5>";
			if(i==0){
				cellHtml = "<table><tr><td style='width: 30%;'><a href='#' onclick='retrocederSemana()'><i class='glyphicon glyphicon-backward'></i></a></td><td>" + cellHtml + "</td></tr></table>";  
			}
			if(i==6){
				cellHtml = "<table><tr><td>" + cellHtml + "</td><td style='width: 30%;text-align: right;'><a href='#' onclick='avanzarSemana()'><i class='glyphicon glyphicon-forward'></i></a></td></tr></table>";  
			}		
					
					
			var fechaStr = dia.nombre + " " + dia.nro + " de " + dia.mes;
			if (dia.feriado == 'P') {
				cellHtml += "<h5><i>(Feriado parcial)</i></h5>";
			} else if (dia.feriado == 'T') {
				cellHtml += "<h5><i>(Feriado)</i></h5>";
			}
			cellTitle.innerHTML = cellHtml;
			cellTitle.align = 'center';
			cellTitle.style.padding = '0px';
		}

		// - Contenidos
		var rowContent = tbl.insertRow(-1);
		for (var i = 0; i < arrDates.length; i++) {
			var cellContent = rowContent.insertCell(-1);
			var att = document.createAttribute("celdaNumero");
			att.value = i;
			cellContent.setAttributeNode(att);
			var att = document.createAttribute("feriado");
			att.value = arrDates[i].feriado;
			cellContent.setAttributeNode(att);
			var att = document.createAttribute("fechaStr");
			att.value = arrDates[i].nombre + " " + arrDates[i].nro + " de "
					+ arrDates[i].mes;
			cellContent.setAttributeNode(att);

			cellContent.width = 150;
			cellContent.id = 'cell_content_' + arrDates[i].nombre;
			cellContent.align = 'center';
			cellContent.valign = 'top';
			if (arrDates[i].feriado == 'T' || arrDates[i].feriado == 'D')
				cellContent.style.background = 'silver'
		}
	}

	function cargarInscriptos(idClase){
		$.ajax({
			type : "POST",
			url : "grilla.php?operacion=getInscriptos",
			cache : false,
			data : 'idClase=' +idClase,
			success : function(result) {
			resultJson = jQuery.parseJSON(result);
			var table = $("#inscriptosTable tbody");
			table.empty();
			$.each(resultJson,function(idx, obj) {
								var usr = obj;
								var preCheck = "";
								if(usr.presente=='S'){
									preCheck = "checked='checked'";
								}
								table.append("<tr><td>"	+ usr.apellido+ ", "+ usr.nombre+ "</td><td style='text-align: center;'>"
													+ "<input class='presente' type='checkbox' idUsr='"+usr.id+"' idClase='"+$("#idClaseHdn").val()+"' "+ preCheck+" >"
													+ "</td></tr>");
								});
			}
		});
	}
	// 				activo: "S"activoFeriado: "N"capacidad: nullclaseId: nulldia: "Jueves"duracion: "60"fechaClase: nullhora: "13:30"id: "12"profesor: "Ruben"vacantes: null
	function cargarModal(idHorario, fechaStr, hora, profesor, idClase, buttonId) {
		$("#successAlert").hide();
		$("#usrDiv").hide();
		$('#horarioSp').html(fechaStr + " " + hora + " hs");
		$('#profesorSp').html(profesor);
		$('#idHorarioHdn').val(idHorario);
		$('#idClaseHdn').val(idClase);
		$('#buttonIdHdn').val(buttonId);
		$('#errorMsg').hide();

		cargarInscriptos( $("#idClaseHdn").val());

		$('#cargaUsr').modal();
	}

	function loadSchedule(arrData) {
		var tblSchedule = document.getElementById('tbl_schedule');
		for (var i = 0; i < arrData.length; i++) {
			var hor = arrData[i];
			if (hor.activo == 'N') {
				continue;
			}
			var cellContent = document
					.getElementById('cell_content_' + hor.dia);

			if (cellContent.getAttribute("feriado") == 'T') {
				continue;
			} else if (cellContent.getAttribute("feriado") == 'P'
					&& hor.activoFeriado == 'N') {
				continue;
			}

			var schedContent = document.createElement('button');
			schedContent.id = "btn_" + i;

			var att = document.createAttribute("claseId");
			att.value = hor.claseId;
			schedContent.setAttributeNode(att);

			schedContent.style.width = '125px';
			schedContent.style.marginTop = '3px';
			schedContent.style.padding = '0px';
			var att = document.createAttribute("idHorario");
			att.value = hor.id;
			schedContent.setAttributeNode(att);

			var att = document.createAttribute("fechaStr");
			att.value = cellContent.getAttribute("fechaStr");
			schedContent.setAttributeNode(att);

			var att = document.createAttribute("profesor");
			att.value = hor.profesor;
			schedContent.setAttributeNode(att);

			var att = document.createAttribute("hora");
			att.value = hor.hora;
			schedContent.setAttributeNode(att);

			var att = document.createAttribute("vacantes");
			att.value = hor.vacantes;
			schedContent.setAttributeNode(att);

			if (hor.vacantes == 0) {
				schedContent.className = 'btn btn-danger';
			} else {
				schedContent.className = 'btn btn-success';
			}
			if (hor.reservadoUsuario == 'S') {
				schedContent.style.backgroundColor = '#777';
				schedContent.style.borderColor = '#777';
			}
			if ((dateCompare(hor.hora) == -1)
					&& (cellContent.getAttribute("celdaNumero") == 0 && semanaVar<1) || semanaVar<0) {
				schedContent.style.backgroundColor = '#95D195';
				schedContent.style.borderColor = '#95D195';
				
			}

			schedContent.innerHTML = '<strong>' + hor.hora + '</strong>';
			// 						<br>' + hor.profesor
			var att = document.createAttribute("data-tooltip");
			att.value = "Profesor: " + hor.profesor;
			schedContent.setAttributeNode(att);

			cellContent.appendChild(schedContent);
			cellContent.appendChild(document.createElement('br'));
			schedContent.onclick = function() {
				var idHorario = this.getAttribute("idHorario");
				var idClase = this.getAttribute("claseId");
				var fechaStr = this.getAttribute("fechaStr");
				var profesor = this.getAttribute("profesor");
				var hora = this.getAttribute("hora");
				cargarModal(idHorario, fechaStr, hora, profesor, idClase,
						this.id);

				// 							alert( 'IDHorario:' + this.getAttribute("idHorario") + ' IDClase:' + this.id);
			}
		}
	}
</script>
{/literal}

<div id="contenedor" class="table-responsive"></div>





<!-- Modal -->
<div class="modal fade" id="cargaUsr" tabindex="-1" role="dialog"
	aria-labelledby="myModalLabel" aria-hidden="true">
	<div class="modal-dialog">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal">
					<span aria-hidden="true">&times;</span><span class="sr-only">Close</span>
				</button>
				<h4>
					Clase:&nbsp;&nbsp;<strong><span id="horarioSp"> </span></strong>
					&nbsp;&nbsp;-&nbsp;&nbsp; Profesor:&nbsp;&nbsp;<strong> <span
						id="profesorSp"></span></strong>
				</h4>
			</div>
			<div class="modal-body">

				<div class="alert alert-danger" id="errorMsg" style="display: none"></div>



				<ul id="tabs" class="nav nav-tabs" data-tabs="tabs">
					<li class="active"><a href="#nuevaCargaTab" data-toggle="tab">Nueva
							reserva</a></li>
					<li><a href="#inscriptosTab" data-toggle="tab">Inscriptos en clase</a></li>
				</ul>
				<div id="my-tab-content" class="tab-content">
					<div class="tab-pane active" id="nuevaCargaTab">
						<br>
						<div style="margin-left: 20px">

							<h5 class="title">Buscar Usuario</h5>
							<!-- Main Input -->
							<input type="text" id="search" autocomplete="off">


							<ul id="results"></ul>
							<input type="hidden" id="idUsrHdn"> <input type="hidden"
								id="idHorarioHdn"> <input type="hidden" id="idClaseHdn">
							<input type="hidden" id="buttonIdHdn"> <input
								type="hidden" id="creditosHdn">
							<div id="usrDiv" class="panel panel-default"
								style="display: none; margin-top: 10px">
								<div class="panel-heading"
									style="padding-top: 5px; padding-bottom: 5px;">
									<strong><span id="nombreSp"></span> </strong>
								</div>
								<div class="panel-body"
									style="padding-top: 5px; padding-bottom: 5px;">
									<h5>
										Creditos disponibles:&nbsp;<strong> <span
											id="creditosSp"></span>
										</strong>&nbsp;&nbsp;&nbsp; Vencimiento:&nbsp;<strong> <span
											id="vencimientoSp"></span>
										</strong>
										<button type="button" id="inscribirBtn"
											class="btn btn-primary" style="margin-left: 40px;">Inscribir</button>
									</h5>
								</div>
							</div>
							<div class="alert alert-success" id="successAlert"
								style="display: none">
								<a href="#" class="close" data-dismiss="alert">&times;</a> La inscripci&oacute;n de <strong>
								<span id = "usrAlertSp"></span></strong> se ha realizado con exito.
							</div>
						</div>
					</div>
					<div class="tab-pane" id="inscriptosTab">
						<div style="overflow: auto; height: 250px">
							<table class="table table-striped" id="inscriptosTable">
								<thead>
									<tr>
										<th>Nombre</th>
										<th style="text-align: center;">Presente</th>
									</tr>
								</thead>
								<tbody></tbody>
							</table>
						</div>


					</div>
				</div>
			</div>
			<div class="modal-footer">
				<button type="button" class="btn btn-default" data-dismiss="modal">Cerrar</button>
				
			</div>
		</div>
	</div>
</div>